/*
 * =========================================================================
 * FUI UI框架   飛翔dē鳥   QQ：1318975624
 * Verson 2.1.5
 * =========================================================================
 */

/* Common */

.fxn-pull-left {
	float: left !important;
}

.fxn-pull-right {
   float: right !important;
}

.fxn-overflow {
	overflow: hidden;
}

/* 自动隐藏文字   */

.fxn-ellipsis-1 {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.fxn-ellipsis-2 {
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
	white-space: normal !important;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.fxn-cursor{
	cursor: pointer;
}

/* 隐藏/显示状态  */

.fxn-hide {
	display: none !important;
}

.fxn-show {
	display: block !important;
}

.fxn-inline {
	display: inline-block !important;
}

.fxn-dot {
	width: .4rem;
	height: .4rem;
	border-radius: 50%;
	background: #FB4848;
}


/* 背景颜色 */

.fxn-bg-blue {
	background: #326FEA !important;
}

.fxn-bg-org {
	background: #FF6E2E !important;
}

.fxn-bg-blue-light {
	background: #20A1F8 !important;
}

.fxn-bg-green {
	background: #3CC556 !important;
}

.fxn-bg-red {
	background: #FB4848 !important;
}

.fxn-bg-yellow {
	background: #FBAF22 !important;
}

.fxn-bg-gray {
	background: #F2F4FA !important;
}

.fxn-bg-white {
	background: #FFFFFF !important;
}


/* 文字颜色 */
.fxn-text-blue {
	color: #409eff !important;
}

.fxn-text-org {
	color: #FF6E2E !important;
}

.fxn-text-blue-light {
	color: #20A1F8 !important;
}

.fxn-text-green {
	color: #3CC556 !important;
}

.fxn-text-red {
	color: #FB4848 !important;
}

.fxn-text-yellow {
	color: #FBAF22 !important;
}

.fxn-text-border {
	color: #E8E8E8 !important;
}

.fxn-text-bg {
	color: #F2F4FA !important;
}

.fxn-text-default {
	color: #3F3F3F !important;
}

.fxn-text-grays {
	color: #666666 !important;
}

.fxn-text-gray {
	color: #888888 !important;
}

.fxn-text-light-gray {
	color: #BDC2CC !important;
}

.fxn-text-font {
	color: #BBBBBB !important;
}

.fxn-text-white {
	color: #FFFFFF !important;
}

/* 文字大小 */

.fxn-ft-12 {
	font-size: 0.6rem !important;
}

.fxn-ft-14 {
	font-size: 0.7rem !important;
}

.fxn-ft-16 {
	font-size: 0.8rem !important;
}

.fxn-ft-18 {
	font-size: 0.9rem !important;
}

.fxn-ft-20 {
	font-size: 1rem !important;
}

.fxn-ft-24 {
	font-size: 1.2rem !important;
}

.fxn-ft-30 {
	font-size: 1.5rem !important;
}

.fxn-ft-38 {
	font-size: 1.9rem !important;
}

.fxn-ft-46 {
	font-size: 2.3rem !important;
}

.fxn-ft-56 {
	font-size: 2.8rem !important;
}

.fxn-ft-68 {
	font-size: 3.4rem !important;
}

/* 文字行高 */

.fxn-lh-20 {
	line-height: 20px !important;
}

.fxn-lh-22 {
	line-height: 22px !important;
}

.fxn-lh-24 {
	line-height: 24px !important;
}

.fxn-lh-28 {
	line-height: 28px !important;
}

.fxn-lh-32 {
	line-height: 32px !important;
}

.fxn-lh-38 {
	line-height: 38px !important;
}

.fxn-lh-46 {
	line-height: 46px !important;
}

.fxn-lh-54 {
	line-height: 54px !important;
}

.fxn-lh-64 {
	line-height: 64px !important;
}

.fxn-lh-76 {
	line-height: 76px !important;
}

/* 文字对齐 */

.fxn-text-left {
	text-align: left !important;
}

.fxn-text-right {
	text-align: right !important;
}

.fxn-text-center {
	text-align: center !important;
}

.fxn-font-weight {
	font-weight: bold;
}

.fxn-font-normal{
	font-weight: normal;
}

.fxn-text-indent {
	text-indent: 1rem;
}

/* Padding */

.fxn-padding-4 {
	padding: .2rem;
}

.fxn-padding-8 {
	padding: .4rem;
}

.fxn-padding-12 {
	padding: .6rem;
}

.fxn-padding-16 {
	padding: .8rem;
}

.fxn-padding-20 {
	padding: 1rem;
}

.fxn-padding-4-0 {
	padding: .2rem 0;
}

.fxn-padding-8-0 {
	padding: .4rem 0;
}

.fxn-padding-12-0 {
	padding: .6rem 0;
}

.fxn-padding-16-0 {
	padding: .8rem 0;
}

.fxn-padding-20-0 {
	padding: 1rem 0;
}

.fxn-padding-0-4 {
	padding: 0 .2rem;
}

.fxn-padding-0-8 {
	padding: 0 .4rem;
}

.fxn-padding-0-12 {
	padding: 0 .6rem;
}

.fxn-padding-0-16 {
	padding: 0 .8rem;
}

.fxn-padding-0-20 {
	padding: 0 1rem;
}

.fxn-padding-8-20 {
	padding: .4rem 1rem;
}

.fxn-padding-12-8 {
	padding: .6rem .4rem;
}

.fxn-padding-20-8 {
	padding: 1rem .4rem;
}

.fxn-padding-15-20 {
	padding: .75rem 1rem;
}

.fxn-padding-l-4 {
	padding-left: .2rem;
}

.fxn-padding-l-8 {
	padding-left: .4rem;
}

.fxn-padding-l-12 {
	padding-left: .6rem;
}

.fxn-padding-l-16 {
	padding-left: .8rem;
}

.fxn-padding-l-20 {
	padding-left: 1rem;
}

.fxn-padding-r-4 {
	padding-right: .2rem;
}

.fxn-padding-r-8 {
	padding-right: .4rem;
}

.fxn-padding-r-12 {
	padding-right: .6rem;
}

.fxn-padding-r-16 {
	padding-right: .8rem;
}

.fxn-padding-r-20 {
	padding-right: 1rem;
}

.fxn-padding-t-4 {
	padding-top: .2rem;
}

.fxn-padding-t-8 {
	padding-top: .4rem;
}

.fxn-padding-t-12 {
	padding-top: .6rem;
}

.fxn-padding-t-16 {
	padding-top: .8rem;
}

.fxn-padding-t-20 {
	padding-top: 1rem;
}

.fxn-padding-b-4 {
	padding-bottom: .2rem;
}

.fxn-padding-b-8 {
	padding-bottom: .4rem;
}

.fxn-padding-b-12 {
	padding-bottom: .6rem;
}

.fxn-padding-b-16 {
	padding-bottom: .8rem;
}

.fxn-padding-b-20 {
	padding-bottom: 1rem;
}

/* Margin */

.fxn-margin-4 {
	margin: .2rem;
}

.fxn-margin-8 {
	margin: .4rem;
}

.fxn-margin-12 {
	margin: .6rem;
}

.fxn-margin-16 {
	margin: .8rem;
}

.fxn-margin-20 {
	margin: 1rem;
}

.fxn-margin-4-0 {
	margin: .2rem 0;
}

.fxn-margin-8-0 {
	margin: .4rem 0;
}

.fxn-margin-12-0 {
	margin: .6rem 0;
}

.fxn-margin-16-0 {
	margin: .8rem 0;
}

.fxn-margin-20-0 {
	margin: 1rem 0;
}

.fxn-margin-0-4 {
	margin: 0 .2rem;
}

.fxn-margin-0-8 {
	margin: 0 .4rem;
}

.fxn-margin-0-12 {
	margin: 0 .6rem;
}

.fxn-margin-0-16 {
	margin: 0 .8rem;
}

.fxn-margin-0-20 {
	margin: 0 1rem;
}

.fxn-margin-l-4 {
	margin-left: .2rem;
}

.fxn-margin-l-8 {
	margin-left: .4rem;
}

.fxn-margin-l-12 {
	margin-left: .6rem;
}

.fxn-margin-l-16 {
	margin-left: .8rem;
}

.fxn-margin-l-20 {
	margin-left: 1rem;
}

.fxn-margin-r-4 {
	margin-right: .2rem;
}

.fxn-margin-r-8 {
	margin-right: .4rem;
}

.fxn-margin-r-12 {
	margin-right: .6rem;
}

.fxn-margin-r-16 {
	margin-right: .8rem;
}

.fxn-margin-r-20 {
	margin-right: 1rem;
}

.fxn-margin-t-4 {
	margin-top: .2rem;
}

.fxn-margin-t-8 {
	margin-top: .4rem;
}

.fxn-margin-t-12 {
	margin-top: .6rem;
}

.fxn-margin-t-16 {
	margin-top: .8rem;
}

.fxn-margin-t-20 {
	margin-top: 1rem !important;
}

.fxn-margin-b-4 {
	margin-bottom: .2rem;
}

.fxn-margin-b-8 {
	margin-bottom: .4rem;
}

.fxn-margin-b-12 {
	margin-bottom: .6rem;
}

.fxn-margin-b-16 {
	margin-bottom: .8rem;
}

.fxn-margin-b-20 {
	margin-bottom: 1rem;
}


/* 按钮 */

.fxn-button-block {
	width: 100%;
}

button,
.fxn-btn {
	position: relative;
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 400;
	font-family: inherit;
	text-decoration: none;
	text-align: center;
	margin: 0;
	border: 0;
	background: #e0e0e0;
	padding: 0.25rem 0.6rem;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	touch-action: manipulation;
	-webkit-user-select: none;
	user-select: none;
}

.fxn-btn-default {
	color: #FFFFFF;
	background: #333333;
}

.fxn-btn-default:hover,
.fxn-btn-default:active {
	color: #FFFFFF;
	background: #444444;
}

.fxn-btn-org {
	color: #FFFFFF;
	border-radius: 4px;
	background: #ffb408;
}

.fxn-btn-org:hover {
	color: #FFFFFF;
	background: #eea600;
}

.fxn-btn-block {
	display: block;
	width: 100%;
	padding: 0.9rem 0;
	margin-bottom: 0;
	font-size: 0.9rem;
}

.fxn-btn-block.fxn-btn-sm {
	padding: 0.4rem 0;
	font-size: 0.7rem;
}

/* Flex */

.fxn-flex {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
}

.fxn-flex-item {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	flex: 1;
}

.fxn-flex-item .el-table {
	position: absolute;
	width: 100%;
}

/* Border */

.fxn-border {
	border: 1px solid #E8E8E8;
}

.fxn-border-t {
	border-top: 1px solid #E8E8E8;
}

.fxn-border-l {
	border-left: 1px solid #E8E8E8;
}

.fxn-border-r {
	border-right: 1px solid #E8E8E8;
}

.fxn-border-b {
	border-bottom: 1px solid #E8E8E8;
}

/* Dialog */

.fxn-dialog {
	position: fixed;
	right: 2rem;
	bottom: 2rem;
	width: 20rem;
	margin-left: -20%;
	border-radius: 2px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
	box-sizing: border-box;
	background: #FFFFFF;
}

.fxn-dialog-header {
	font-size: .8rem;
	padding: .5rem .75rem;
}

.fxn-dialog-header i {
	float: right;
	padding-top: .25rem;
}

/* Tabs */
.fxn-tabs {
	overflow: hidden;
}

.fxn-tabs .el-tabs__header {
	margin: 0 0 1px;
}

.fxn-tabs .el-tabs--card>.el-tabs__header {
	border-bottom: inherit;
}

.fxn-tabs .el-tabs--card>.el-tabs__header .el-tabs__nav {
	border-radius: 2px;
	border: 0;
	background: #FFFFFF;
}

.fxn-tabs .el-tabs__item {
	min-width: 4.8rem;
	height: 1.8rem;
	color: #888888;
	font-size: .7rem;
	text-align: center;
	line-height: 1.8rem;
	background: #FFFFFF;
}

.fxn-tabs .el-tabs__item:last-child {
	border-right: 0;
}

.fxn-tabs .el-tabs__nav {
	border-radius: 3px;
	border: 1px solid #326FEA;
	background: #FFFFFF;
}

.fxn-tabs .el-tabs__active-bar {
	background: initial;
}

.fxn-tabs .el-tabs__nav-wrap::after {
	background: initial
}

.fxn-tabs .el-tabs__item.is-active {
	color: #FFFFFF;
	background-color: #326FEA;
}

.fxn-tabs .el-tabs--card>.el-tabs__header .el-tabs__item {
	border-left: 0;
	border-bottom: 0;
	-webkit-transition: color 0s cubic-bezier(.645, .045, .355, 1), padding 0s cubic-bezier(.645, .045, .355, 1);
	transition: color 0s cubic-bezier(.645, .045, .355, 1), padding 0s cubic-bezier(.645, .045, .355, 1);
}

.fxn-tabs .el-tabs--card>.el-tabs__header .el-tabs__item:first-child {
	border-left: 0;
}

.fxn-tabs .el-tabs--card>.el-tabs__header .el-tabs__item:hover {
	color: #326FEA
}

.fxn-tabs .el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
	border-bottom-color: inherit;
}

.fxn-tabs .el-tabs--card>.el-tabs__header .el-tabs__item.is-active:hover {
	color: #FFFFFF;
}

.fxn-tabs .el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active {
	color: #326FEA;
	background-color: #FFFFFF;
	border-right-color: #326FEA;
	border-left-color: #326FEA
}

.fxn-tabs .el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2),
.el-tabs--bottom .el-tabs__item.is-top:nth-child(2),
.el-tabs--top .el-tabs__item.is-bottom:nth-child(2),
.el-tabs--top .el-tabs__item.is-top:nth-child(2) {
	padding-left: 1.25rem;
}

.fxn-tabs .el-tabs--bottom .el-tabs__item.is-bottom:last-child,
.el-tabs--bottom .el-tabs__item.is-top:last-child,
.el-tabs--top .el-tabs__item.is-bottom:last-child,
.el-tabs--top .el-tabs__item.is-top:last-child {
	padding-right: 1.25rem;
}

.fxn-tabs .el-collapse-item__content {
	color: #666666;
}

.fxn-tabs .el-collapse-item__header {
	font-size: 14px;
}
